<template>
  <div class="toolbar colorMain">
    <div class="mt-10 mb-10">
      <el-form :inline="true" size="small">
        <el-form-item label="用户ID" ><el-input v-model.trim="queryFrom.user_id"/></el-form-item>
        <el-form-item label="时间"><date-picker v-model="queryFrom.time_range"/></el-form-item>
        <el-form-item label="提现类型" >
          <el-select v-model="queryFrom.withdraw_sub_type" clearable multiple collapse-tags placeholder="请选择">
            <el-option v-for="item in options2" :key="item.value" :label="item.label" :value="item.value"/>
          </el-select>
        </el-form-item>
        <!--<el-form-item label="提现状态" >-->
        <!--<el-select v-model="queryFrom.withdraw_status" clearable multiple collapse-tags placeholder="请选择">-->
        <!--<el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value"/>-->
        <!--</el-select>-->
        <!--</el-form-item>-->
        <el-button size="small" type="primary" @click="sendQuery">搜索</el-button>
      </el-form>
    </div>
    <analyse-table :table-data="tableData" :key_mapper="key_mapper" :sortable = "false" :min-width = "160" size="small" @sort-change="sortChange"/>
    <el-pagination :current-page.sync="page" :page-size="size" :total.sync="total" class="mt-10" layout="total, sizes, prev, pager, next, jumper" @current-change="currentChange" @size-change="handleSizeChange"/>
  </div>
</template>
<script>
import { pickTime } from '@/model/DateRange'
import { getWithdrawDetail } from '@/api/table'
import { withdrawSubType, withdrawStatus } from '@/model/'
import mixins from '@/model/mixins'

export default {
  name: 'WithdrawDetail',
  mixins: [mixins],
  data() {
    return {
      queryFrom: {
        user_id: '',
        time_range: pickTime,
        // withdraw_status: [],
        withdraw_sub_type: []
      },
      API: getWithdrawDetail,
      options1: withdrawStatus,
      options2: withdrawSubType
    }
  },
  methods: {
    handleChange() {

    }
  }
}
</script>
